import { createApp } from 'vue' // 1. 从Vue 3导入createApp函数
import { createPinia } from 'pinia' // 2. 从Pinia导入状态管理库的创建函数
import 'normalize.css'
import App from './App.vue' // 3. 导入根组件App.vue
import router from './router' // 4. 导入路由配置
import ElementPlus from 'element-plus' // 5. 导入Element Plus UI组件库
import 'element-plus/dist/index.css' // 6. 导入Element Plus的样式文件
import * as ElementPlusIconsVue from '@element-plus/icons-vue' // 7. 导入Element Plus的图标组件

// 根据环境变量决定是否加载 Mock.js
if (import.meta.env.VITE_USE_MOCK === 'true') {
  import('@/api/mock')
}

const app = createApp(App) // 7. 创建Vue应用实例，以App组件为根组件
app.use(ElementPlus) // 8. 使用Element Plus插件
// 8.1 注册Element Plus的图标组件
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component)
}
app.use(createPinia()) // 9. 使用Pinia状态管理
app.use(router) // 10. 使用路由
app.mount('#app') // 11. 将应用挂载到HTML中的#app元素
